<ion-view view-title="{{ bucket.name }}">
  <ion-nav-buttons side="left">
    <button class="button button-clear" ng-if="mode === 'view'" ng-click="edit()"> <i class="icon ion-ios-compose-outline"></i> 编辑 </button>
    <button class="button button-clear" ng-if="mode != 'view'" ng-click="cancel()"> <i class="icon ion-ios-close-empty"></i> 取消 </button>
  </ion-nav-buttons>
  <ion-nav-buttons side="right">
    <button class="button button-clear" ng-if="mode === 'view'" ng-click="add()"> <i class="icon ion-ios-plus-empty"></i> 添加 </button>
    <button class="button button-clear" ng-if="mode != 'view'" ng-click="save()"> <i class="icon ion-ios-checkmark-empty"></i> 保存 </button>
  </ion-nav-buttons>

  <ion-content>
    <div class="list list-inset" ng-if="mode === 'add'">
      <form name="form">
        <label class="item item-input">
          <span class="input-label">药品名称</span>
          <input type="text" ng-model="newPillData.name" required>
        </label>
        <label class="item item-input">
          <span class="input-label">制药厂商</span>
          <input type="text" ng-model="newPillData.brand">
        </label>
        <label class="item item-input item-select">
          <div class="input-label"> 药剂种类 </div>
          <select ng-model="newPillData.type" ng-options="type as type for type in formOptions.type"></select>
        </label>
        <label class="item item-input">
          <span class="input-label">持有数量</span>
          <input type="number" ng-model="newPillData.stock" required>
        </label>
      </form>
    </div>

    <ion-list show-delete="mode === 'edit'">
      <ion-item ng-repeat="pill in bucket.pills" class="item-remove-animation">
        <ion-delete-button class="ion-minus-circled" ng-click="removeFromBucket(pill)"></ion-delete-button>
        <a class="item-icon-left">
          <i class="icon ion-ios-keypad-outline" ng-if="pill.type != '液体'"></i>
          <i class="icon ion-ios-flask-outline" ng-if="pill.type === '液体'"></i>
          {{ pill.name }}
          <span class="item-note">
             剩余 {{ pill.stock }}
          </span>
        </a>
      </ion-item>
    </ion-list>

  </ion-content>
</ion-view>
